<template>
  <div class="detail">
    <MesBox
      title="打印信息填写"
      v-model="visible"
      :width="1000"
      :height="600"
      :onModelClose="onModelClose"
    >
      <MesForm
        ref="sendForm"
        :formFields="formFields"
        :formRules="formRules"
      ></MesForm>
      <MesTable
        :ck="false"
        index
        :columns="columns"
        :tableData="dataSource"
      ></MesTable>
      <template #footer>
        <el-button type="danger" @click="saveData">
          <i class="el-icon-check"></i>
          保存</el-button
        >
      </template>
    </MesBox>
  </div>
</template>

<script setup>
import MesBox from '@/components/basic/MesBox.vue'
import MesForm from '@/components/basic/MesForm.vue'
import MesTable from '@/components/basic/MesTable.vue'
import { getCurrentInstance, ref } from 'vue'
import { ElMessageBox } from 'element-plus'

let dataSource = ref([])
const that = getCurrentInstance().appContext.config.globalProperties
let print = null
const emits = defineEmits(['parentCall'])
const sendForm = ref(null)
let visible = ref(false)
let formFields = ref({
  customer: '',
  invCode: '',
  invName: '',
  department: '',
  date: '',
  moCode: '',
})
let formRules = [
  [
    {
      title: '客户',
      field: 'customer',
      type: 'input',
      readonly: true,
    },
    {
      title: '产品编码',
      field: 'invCode',
      type: 'input',
      readonly: true,
    },
  ],
  [
    {
      title: '产品名称',
      field: 'invName',
      type: 'input',
      readonly: true,
    },
    {
      title: '请购单位',
      field: 'department',
      type: 'input',
      readonly: true,
    },
  ],
  [
    {
      title: '订单号',
      field: 'moCode',
      type: 'input',
      readonly: true,
    },
    {
      title: '请购日期',
      field: 'date',
      type: 'date',
      readonly: true,
    },
  ],
]
const columns = [
  {
    title: 'reqList_Id',
    field: 'reqList_Id',
    hidden: true,
  },
  {
    title: '物料编号',
    field: 'invCode',
  },
  {
    title: '物料名称',
    field: 'invName',
  },
  {
    title: '单位',
    field: 'unitName',
  },
  {
    title: '物料规格',
    field: 'invStd',
  },
  {
    title: '订单需求量',
    field: 'qty',
  },
  {
    title: '标准需求',
    field: 'realityQty',
  },
  {
    title: '应采购数量',
    field: 'shouldQty',
    required: true,
    edit: {
      type: 'number',
      min: 0,
    },
    onKeyPress: (row) => {
      const value = +row.shouldQty
      if (value > row.realityQty) {
        row.shouldQty = row.realityQty
        that.$message.error('应采购数量不能大于标准需求')
      }
    },
  },
  {
    title: '需求日期',
    field: 'needDate',
    required: true,
    edit: {
      type: 'date',
    },
  },
  {
    title: '备注',
    field: 'remark',
  },
]

//保存
const saveData = async () => {
  console.log(dataSource.value)
  let noRuleData = dataSource.value.find(
    (item) =>
      item.shouldQty == '' ||
      item.shouldQty == null ||
      item.needDate == '' ||
      item.needDate == null
  )
  if (noRuleData !== undefined) {
    that.$message.error('请填写必填项')
    return
  }

  const params = dataSource.value.map((item) => {
    return {
      reqList_Id: item.reqList_Id,
      requireDate: item.needDate,
    }
  })
  //编辑需求日期
  let flag = await updateRequireDate({
    children: params,
  })
  if (flag) {
    try {
      await ElMessageBox.confirm('是否打印该单据？', '提示', {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning',
      })

      //打印
      print({
        ...formFields.value,
        list: dataSource.value,
      })
    } catch (err) {
      console.log(err)
    } finally {
      emits('parentCall', ($parent) => {
        $parent.search()
      })
    }
  }
}

const onModelClose = () => {
  for (let key in formFields.value) {
    formFields.value[key] = ''
  }
  dataSource.value = []
}

const open = (data, printFun) => {
  Object.keys(formFields.value).forEach((key) => {
    formFields.value[key] = data[key]
  })
  print = printFun
  dataSource.value = data.list
  visible.value = true
  console.log(data);
}

const updateRequireDate = async (data) => {
  const res = await that.http.post(
    '/api/Production_RequisitionList/UpdateRequisitionList',
    data,
    true
  )
  if (res.status) {
    that.$message.success('编辑成功')
    visible.value = false
    return true
  } else {
    that.$message.error(res.message)
    return false
  }
}

defineExpose({ open })
</script>

<style lang="less" scoped>
.detail {
  padding: 15px;
}
</style>
